<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
    
    <link rel="stylesheet" type="text/css" href="../css/mui.css"/>
     <!--<link rel="stylesheet" type="text/css" href="../css/lixiaodan.css"/>-->
</head>
<body>
    <script src="../js/jquery.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/canvas2image.js" type="text/javascript"></script>
    <script src="../js/html2canvas.js" type="text/javascript"></script>
    <script src="../js/mui.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
    $(function(){
     		
     			alert("长按保存即可下载！");
     			html2canvas($("#lixiaodan"), {
	                onrendered: function(canvas) {
	                  
	                     var img1 = canvas.toDataURL();
                		 console.log(img1);
                		 $("img").attr("src",img1);
                		 $(".lixiaodan").hide();
	                }
				});
				
     		});
     		
     	
    </script>
    <button id="butsave">save</button>
    <div class="wrap">
    	<div class="lixiaodan" id="lixiaodan" style="width:100px;height:500px;background-color:blue">
    		123123123<br />
    		123123123<br />
    		123123123<br />
    		123123123<br />
    		123123123<br />
    		123123123<br />
    		123123123<br />
    		123123123<br />
    		
    		
    		
    	</div>
    </div>
    
    
    	
    </div>
    <img id="img1"   style="width:210px;height:290px;">
    
</body>
</html>
